<template>
  <div class="SMSVcode">
    <el-button style="width: 123px;padding-left: 12px;" @click="getSMSVcode" :disabled="btnDisabled">{{buttonName}}</el-button>
  </div>
</template>

<script>

  export default {
    name: 'SMSVcode',
    props: ["type", "disabled","prefix","codeValue"], //type为1是手机号，2为邮箱,disable为true禁止点击，prefix是手机号的前缀
    components:{

    },
    data() {
      return {
        send_type: this.type,
        mobile_prefix:this.prefix,
        buttonName: this.$t('sms_btn_name'),
        time: 10,
        interval: null,
        btnDisabled:this.disabled
      };
    },
    methods: {
      clearTimer() {
        window.clearInterval(this.interval);
        if (this.send_type == '1' || this.type == '1' || this.send_type == '10' || this.type == '10') {
          this.buttonName = this.$t('sms_mobile_tit');
        } else {
          this.buttonName = this.$t('sms_email_tit');
        }
      },
      getSMSVcode() {
          let me = this;
          if(this.send_type == '1' || this.send_type == '10'){
              if(!this.tool_is_mobile(this.codeValue)){
                  me.$message({message: me.$t('sms_mess_phone_error'),type: 'warning'});
                return;
              }
          }
          if(this.send_type == '2'){
              if(!this.tool_is_email(this.codeValue)){
                  me.$message({message: me.$t('sms_mess_email_error'),type: 'warning'});
                  return;
              }
          }
          this.existCheck(function (isExist) {
              if(isExist){
                  if(me.send_type == '1' || me.send_type == '10'){
                      me.$message({message: me.$t('sms_mess_phone_exist'),type: 'warning'});
                  }else {
                      me.$message({message: me.$t('sms_mess_email_exist'),type: 'warning'});
                  }
                  return;
              }else {
                  me.interval = window.setInterval(function () {
                      me.buttonName = me.time + me.$t('sms_btn_name_2');
                      --me.time;
                      me.btnDisabled = true;
                      if (me.time <= 0) {
                          me.btnDisabled = false;
                          me.buttonName = me.$t('sms_btn_name_1');
                          me.time = 10;
                          window.clearInterval(me.interval);
                      }
                  }, 1000);
                  if(me.send_type != '10'){
                      me.send_code();//发送验证码
                  }else {
                      me.send_findpass_code();
                  }
              }
          });
      },
        existCheck(cb) {//校验用户是否存在
            let _self=this;
            if(this.send_type == '10'){
                cb(false);
            }else {
                _self.axios
                    .post(this.CHECK_USER, {
                        mobile_prefix: this.mobile_prefix+"",
                        type: this.send_type+"",
                        value: this.codeValue+"",
                    })
                    .then(res => {
                        if (res.data.status == "fail") {
                            cb(true);
                        } else {
                            cb(false);
                        }
                    })
                    .catch(res => {
                    });
            }
        },
        send_code(){
            let _self=this;
            this.axios
              .post(this.SEND_COCE, {
                value: this.codeValue,
                type: this.send_type,
                mobile_prefix: this.mobile_prefix ? this.mobile_prefix :'86'
              })
              .then(res => {
                if (res.data.status == "success") {
                  this.$message({message: _self.$t('sms_send_success'), type: "success"});
                } else {
                  this.$message({message: res.data.msg});
                }
              })
              .catch(res => {

              });
        },
        send_findpass_code(){
            let _self=this;
            this.axios
                .post("/api/v1/user/send_code_by_username", {
                    value: this.codeValue,
                })
                .then(res => {
                    if (res.data.status == "success") {
                        this.$message({message: _self.$t('sms_send_success'), type: "success"});
                    } else {
                        this.$message({message: res.data.msg});
                    }
                })
                .catch(res => {

                });
        }

    },
    mounted() {
     // if (this.type) this.send_type = this.type;
        this.disabled=false;
    },
    beforeDestroy() {
      this.clearTimer();
    },
    watch: {
      // send_type(newv, old) {
      //   if (newv == '2') {
      //     this.buttonName = '发送邮件';
      //   }
      // }
    },
  }
</script>

<style scoped lang="scss">
  .SMSVcode{ display: inline-block;}
</style>
